<style type="text/css">
.grade li{ line-height:20px;}
</style>
<div style='overflow-y:auto;width:300px;height:500px'>
<ul class='grade'>
<?php 
if(isset($countryList) && $countryList):
	foreach ($countryList as $country):
?>
<li><a herf='javascript:void(0)' >&nbsp;&nbsp;&nbsp;&nbsp;</a><label><input type='checkbox' name="area[]" onclick='select_area(this,0)' id="area_<?php echo $country['id'];?>" value='<?php echo $country['id'];?>' leval='1'>&nbsp;&nbsp;<?php echo $country['name'];?></label></li>
<?php 
	endforeach;
endif;
?>
</ul>
</div>
<script>
function select_area(obj)
{
	$(obj).parent().parent().find('ul input').attr('checked',obj.checked);
	var value='';
	$('#select_area input:checked').each(function (){
		value += $(this).val()+';';
	});
	var  current = $('#area_list').data('obj');
	$(current).next('input[type=hidden]').val(value);
}
</script>